<template>
  <div v-if="show" class="fontDa">
    <div v-for="hzItem in hzTableList" v-if="hzItem" style="margin-bottom: 40px">
      <!--      <div class="customTableHeader">-->
      <!--        <div class="customTableTitle" @click="open(hzItem)">{{ hzItem.cepingHdglCppmxbInfo.cppName }}</div>-->
      <!--      </div>-->
      <div class="fontDa">
        <div class="h_dw_time" v-if="hzItem.cepingHdglCppmxbInfo">
          <div style="margin-left: 20px;font-size: 24px">单位：{{ hzItem.cepingHdglCppmxbInfo.sheetDept }}</div>
        </div>
        <div class="biaoTiGi" v-if="hzItem.cepingHdglCppmxbInfo">
          <span @click="open(hzItem)">{{ hzItem.cepingHdglCppmxbInfo.cppName }}</span>
        </div>
        <div class="hz5-table-box">
          <table>
            <thead>
            <tr>
              <td style="width: 70px" class="text-center hz5-table-header">序号</td>
              <td class="text-center hz5-table-header">测评对象</td>
              <td class="text-center hz5-table-header">结果</td>
              <td class="text-center hz5-table-header">操作</td>
            </tr>
            </thead>
            <tbody>
            <!--单选-->
            <tr v-for="(danItem,index) in hzItem.tableColumn" :class="(index+1)%2==0?'hz5-stripe-tr':''">
              <td class="text-center">{{ index + 1 }}</td>
              <td>{{ danItem.title }}</td>
              <td>
                <div v-for="(danAnsItem,index) in hzItem.voteOptList">
                <span v-if="danAnsItem.itemId==danItem.itemId">
                  {{ danAnsItem.optId|filterAns(danItem.optList) }}</span>
                </div>
              </td>
              <td v-if="index==0" class="text-center" rowspan="99999" style="width: 100px">
                <el-button type="warning" style="margin-left:10px" @click="open(hzItem)">返回测评界面</el-button>
              </td>
            </tr>
            <!--多选-->
            <tr v-for="(duoItem,duoIndex) in hzItem.multiSelect"
                :class="(hzItem.tableColumn.length+duoIndex+1)%2==0?'hz5-stripe-tr':''">
              <td class="text-center ">{{ hzItem.tableColumn.length + duoIndex + 1 }}</td>
              <td>{{ duoItem.title }}</td>
              <td>
                <div v-for="(duoAnsItem,indexs) in hzItem.voteOptList">
                  <span
                    v-if="duoItem.itemId==duoAnsItem.itemId">{{ duoAnsItem.optId|filterAns(duoItem.optList) }}</span>
                </div>
              </td>
            </tr>
            <!--输入框-->
            <tr v-for="(item,questIndex) in hzItem.questionList"
                :class="(hzItem.tableColumn.length+hzItem.multiSelect.length+questIndex+1)%2==0?'hz5-stripe-tr':''">
              <td class="text-center">{{ hzItem.tableColumn.length + hzItem.multiSelect.length + questIndex + 1 }}</td>
              <td>{{ questIndex + 1 }}、{{ item.title }}</td>
              <td>
                <div v-for="ansItem in hzItem.voteAnsList">
                  <span v-if="ansItem.itemId==item.itemId">{{ ansItem.answer }}</span>
                </div>
              </td>
            </tr>
            </tbody>
          </table>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import {wdXuanPiao, wdXuanPiaoXp} from "@/api/ceping/cepinghdglxpxxb";
import {anonymousSelhdidList as selhdidList} from '@/api/ceping/cepinghdglcppmxb'
import {wdXuanPiaoXpNew, xpInfoHz, xpInfo, wdXuanPiaoXpNewSm, xpInfoSm, xpInfoHzSm} from "@/api/ceping/jxevalvote";
import {getObj} from "@/api/ceping/cepinghdglb";
import {getIds as deptsGet} from "@/api/admin/dept";
import {getIds as usersGet} from "@/api/admin/user";

import djDf from "./cpIndexHzDjdf";

export default {
  name: "cpIndexHz",
  components: {
    djDf
  },
  data() {
    return {
      show: true,
      type: "",
      hdId: null,
      xcCode: "",
      xpList: [],//所有选票
      cppList: [],
      cepingHdglb: {},
      deptObj: {},
      userObj: {},
      djxxDjmx: false,
      tableData: [],
      cepingHdglCppmxbInfo: {},
      colShowAll: [],
      hzTableList: [],
      tableColumn: [],
      multiSelect: [],
      questionList: [],
      voteAnsList: [],
      voteOptList: [],
      tabsList: [],
      fromPage: '',
      fromXpId: '',
      fromcppId: ''
    }
  },
  filters: {
    filterAns(value, optList) {
      if (!value) return '';
      var findOpt = optList.find(item => item.id == value)
      if (findOpt) {
        value = findOpt.optName
      }
      return value
    }
  },
  methods: {
    init() {
      this.xpList = [];
    },
    //实名打票过来的汇总初始化
    InitHdHz(data) {
      this.xcCode = data.xpCode;
      this.tabsList = data.tabsList;
      this.fromPage = data.fromPage;
      this.fromXpId = data.fromXpId;
      this.fromcppId = data.fromcppId;
      this.hzTableList = [];
      this.hdId = data.hdId;
      this.userId = this.$store.state.user.userInfo.userId;
      const params = {
        hdId: this.hdId,
        userId: this.userId,
        sheetType:5
      }
      wdXuanPiaoXpNewSm(params).then(res => {
        this.xpList = res.data.data;
        this.hzTableList = res.data.data;
        this.xpList.forEach((item, index) => {
          var hzTableObj = {}
          //获取表头
          // hzTableObj.showColumns=this.getColum(item.id,index);
          this.getHdColum(item.cppId, index);
          //获取表格数据
          // this.getHzData(index);
        })
        this.$forceUpdate();
      })
    },
    //实名打票获取汇总表格表头
    getHdColum(cppId, index) {
      var dataList = [];
      this.hzTableList[index].tableColumn = [];
      this.hzTableList[index].multiSelect = [];
      this.hzTableList[index].questionList = [];
      let params = {
        cppId: cppId,
        hdId: this.hdId,
        userId: this.userId
      }
      xpInfoSm(params).then(res => {
        this.hzTableList[index].cepingHdglCppmxbInfo = res.data.data.cepingHdglCppmxbInfo;
        this.msgList = JSON.parse(res.data.data.cepingHdglCppmxbInfo.ruleDetailJson);
        this.msgList.forEach(item => {
          if (item.itemType == 1) {
            this.hzTableList[index].tableColumn.push(item);
          } else if (item.itemType == 2) {
            this.hzTableList[index].multiSelect.push(item);
          } else if (item.itemType == 3) {
            this.hzTableList[index].questionList.push(item)
          }
        })
        //this.$forceUpdate()
        this.getHdHzData(cppId, index);
        this.$forceUpdate()
      })
    },
    //实名打票获取汇总表格数据
    getHdHzData(cppId, index) {
      let params = {
        cppId: cppId,
        sheetType: 5,
        hdId: this.hdId,
        userId: this.userId
      }
      xpInfoHzSm(params).then(res => {
        this.voteAnsList = res.data.data.voteAnsList;
        this.voteOptList = res.data.data.voteOptList;
        this.hzTableList[index].voteAnsList = this.voteAnsList;
        this.hzTableList[index].voteOptList = this.voteOptList;
        this.$emit('closeLoading')
        this.$forceUpdate()
      })
    },
    //汇总初始化
    initHz(data) {
      this.xcCode = data.xpCode;
      this.tabsList = data.tabsList;
      this.fromPage = data.fromPage;
      this.fromXpId = data.fromXpId;
      this.fromcppId = data.fromcppId;
      this.hzTableList = [];
      var params = {
        xpCode: this.xcCode,
        sheetType: 5,
      }
      wdXuanPiaoXpNew(params).then(res => {
        this.xpList = res.data.data;
        this.hzTableList = res.data.data;
        this.xpList.forEach((item, index) => {
          var hzTableObj = {}
          //获取表头
          // hzTableObj.showColumns=this.getColum(item.id,index);
          this.getColum(item.cppId, index);
          //获取表格数据
          // this.getHzData(index);
        })
        this.$forceUpdate();
      })
    },
    //初始按选票
    initXp(xcCode) {
      this.init();
      this.type = "XP";
      this.xcCode = xcCode;
      wdXuanPiaoXp(xcCode).then(res => {
        if (res.data.data.length > 0) {
          let data = res.data.data;
          this.initJG(data);
        } else {
          this.$notify.closeAll();
          this.$notify.error('票号中没有选票信息');
        }
      })
    },
    initJG(d) {
      let data = d.sort(compareZb);

      function compareZb(a, b) {
        return b.cphzfz - a.cphzfz;
      }

      this.cppList = [];
      let cppListId = [];

      selhdidList(data[0].hdId).then(res => {
        let list = res.data.data;
        this.djxxDjmx = false;
        for (var j in list) {
          if (!(list[j].djxxDjmx == "" || list[j].djxxDjmx == null)) {
            this.djxxDjmx = true;
          }
          if (cppListId.indexOf(list[j].cppId) == -1) {
            for (let i in data) {
              if (data[i].cppId == list[j].cppId) {
                this.cppList.push(list[j])
                cppListId.push(list[j].cppId)
                break;
              }
            }
          }
        }
        for (let i in data) {
          if (data[i].bcpDx == "部门") {
            this.xpList.push(data[i])
          }
        }
        for (let j in data) {
          if (data[j].bcpDx == "个人") {
            this.xpList.push(data[j])
          }
        }
        this.getHdInfo();
        this.getDeptUser();
      })
    },
    getXpList(cp) {
      let list = [];
      for (var i in this.xpList) {
        if (this.xpList[i].cppId == cp.cppId) {
          list.push(this.xpList[i])
        }
      }
      return list;
    },
    getHdInfo() {
      if (this.xpList.length > 0) {
        getObj(this.xpList[0].hdId).then(res => {
          this.cepingHdglb = res.data.data;
        })
      }
    },
    getDeptUser() {
      let deptIds = [];
      let userIds = [];
      for (var i in this.xpList) {
        let r = this.xpList[i];
        if (r.bcpDx == "部门") {
          deptIds.push(r.bcpDeptId)
        }
        if (r.bcpDx == "个人") {
          userIds.push(r.bcpUserId)
        }
      }
      if (deptIds.length > 0) {
        deptsGet(deptIds.join()).then(res => {
          for (var i in res.data.data) {
            this.deptObj[res.data.data[i].deptId] = res.data.data[i];
            for (var j in this.xpList) {
              let r = this.xpList[j];
              if (r.bcpDx == "部门") {
                if (res.data.data[i].deptId == r.bcpDeptId) {
                  this.$set(r, "deptInfo", res.data.data[i]);
                }
              }
            }
          }
        })
      }
      if (userIds.length > 0) {
        usersGet(userIds.join()).then(res => {
          for (var i in res.data.data) {
            this.userObj[res.data.data[i].userId] = res.data.data[i];
            for (var j in this.xpList) {
              let r = this.xpList[j];
              if (r.bcpDx == "个人") {
                if (res.data.data[i].userId == r.bcpUserId) {
                  this.$set(r, "userInfo", res.data.data[i]);
                }
              }
            }
          }

        })
      }
    },
    open(t) {
      var params = {
        id: t.cppId,
        clickTab: 'ceping5',
        upPageObj: {
          toPage: this.fromPage,
          tpXpId: this.fromXpId,
          cppId: this.fromcppId
        }
      }
      this.$emit('openXp', params);
    },
    //获取汇总表格数据
    getHzData(cppId, index) {
      var params = {
        xpCode: this.xcCode,
        sheetType: 5,
        cppId: cppId
      }
      xpInfoHz(params).then(res => {
        this.voteAnsList = res.data.data.voteAnsList;
        this.voteOptList = res.data.data.voteOptList;
        this.hzTableList[index].voteAnsList = this.voteAnsList;
        this.hzTableList[index].voteOptList = this.voteOptList;
        this.$forceUpdate()
      })
    },
    //获取汇总表格表头
    getColum(cppId, index) {
      var dataList = [];
      var params = {
        cppId: cppId,
        xpCode: this.xcCode
      }
      this.hzTableList[index].tableColumn = [];
      this.hzTableList[index].multiSelect = [];
      this.hzTableList[index].questionList = [];
      xpInfo(params).then(res => {
        this.hzTableList[index].cepingHdglCppmxbInfo = res.data.data.cepingHdglCppmxbInfo;
        this.msgList = JSON.parse(res.data.data.cepingHdglCppmxbInfo.ruleDetailJson);
        this.msgList.forEach(item => {
          if (item.itemType == 1) {
            this.hzTableList[index].tableColumn.push(item);
          } else if (item.itemType == 2) {
            this.hzTableList[index].multiSelect.push(item);
          } else if (item.itemType == 3) {
            this.hzTableList[index].questionList.push(item)
          }
        })
        //this.$forceUpdate()
        this.getHzData(cppId, index);
        this.$forceUpdate()
      })
    },
  }
}
</script>

<style scoped>
.hz5-table-box table {
  width: 100%;
}

.hz5-table-box table thead tr td {
  border: solid 1px #ebeef5;
}

.hz5-table-box table tbody tr td {
  padding: 10px;
  border: solid 1px #ebeef5;
}

.customTableTitle:hover {
  color: #1a71fb;
  cursor: pointer;
}

.hz5-table-header {
  background: #b0bde2;
  font-weight: bold;
  color: #303745;
  font-size: 24px;
  padding: 14px 5px;
}

.font-weight-bold {
  font-weight: bold;
}

.hz5-table-box table tbody tr td {
  font-size: 24px;
  color: #303745;
}

.hz5-table-box .hz5-stripe-tr,
.hz5-table-box .hz5-stripe-tr td {
  background: #eff2fa;
}

.biaoTiGi {
  width: 100%;
  height: 60px;
  line-height: 60px;
  text-align: center;
  font-size: 28px;
  font-weight: bolder;
  /*background: #1f84ec;*/
  background: #b0bde2;
  /*color: #fff;*/
}

.biaoTiGi span:hover {
  color: #1a71fb;
  cursor: pointer;
}
</style>
